.root {
  font-weight: 300;
  margin-left: 18px;
}

.root a {
  transition: all .2s;
}

.root:global(.active) a,
.root a:hover {
  color: var(--accent-highlight);
}

/* types */
.default {
  padding: 10px 0;
}

.default a {
  padding: 0 14px;
}

.default:last-child a {
  padding-right: 12px;
}

.cta {
  background-color: var(--brand-color);
  border-radius: 2.25rem;
  font-weight: 400;
}

.cta a {
  align-items: center;
  color: white !important;
  display: inline-flex;
  padding: 0 28.5px;
  height: 48px;
  letter-spacing: .5px;
  text-shadow: 0.5px 0 0;
}

.cta:hover a {
  color: white;
}
